<%--
  Created by IntelliJ IDEA.
  User: LENOVO
  Date: 2020/8/20
  Time: 21:40
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>

<html>
<head>
    <meta charset="utf-8">
    <title>删除</title>
    <link rel="stylesheet" href="//apps.bdimg.com/libs/jqueryui/1.10.4/css/jquery-ui.min.css">
    <script src="//apps.bdimg.com/libs/jquery/1.10.2/jquery.min.js"></script>
    <script src="//apps.bdimg.com/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
    <link rel="stylesheet" href="jqueryui/style.css">
   <style>
       body { font-size: 62.5%; }
   </style>
</head>
<body>
<div id="dialog" title="删除">
    <p>
        <span class="ui-icon ui-icon-alert" style="float:left;
              margin:0 7px 20px 0;"></span>
        删除后无法恢复，您确定吗？
    </p>
</div>
<button id="delect">删除</button>
</body>

<script>
    $(function() {
        $( "#dialog" ).dialog({
            modal: true,
            buttons: {  //按钮
                "Delete it": function() {
                    $( this ).dialog( "close" );
                },
                Cancel: function() {
                    $( this ).dialog( "close" );
                }
            },
            autoOpen: false,  //点击弹窗
            show: {
                effect: "blind",
                duration: 1000
            }
        });
        $( "#delect" ).click(function() {
            $( "#dialog" ).dialog( "open" );
        });
    });
</script>

</html>
